<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<div id="">
			省份:<select name="" id="provinceid">
				<option value="-1">请选择省份</option>
			</select>
			城市:<select name="" id="cityid">
				<option value="-1">请选择城市</option>
			</select>
			县区:<select name="" id="countyid">
				<option value="-1">请选择县区</option>
			</select>
			<br>
			你选择的是:<label id="select"></label>
		</div>
	</body>
	<script type="text/javascript">
		var provinces=['江西省','福建','湖南'];
		var citys=[
			['萍乡市','南昌市'],
			['泉州市','厦门市'],
			['长沙市','株洲市']
		];
		var countys=[
			[['莲花县','上栗县'],['新建县','安义县']],
			[['安溪','德化'],['海沧区','集美区']],
			[['天心区','岳麓区'],['茶陵县','炎陵县']]
		];
		function changeprovince(){
			var provinceobj=document.getElementById('provinceid');
			var cityobj=document.getElementById('cityid');
			cityobj.innerHTML=`<option value="">请选择城市</option>`;
			
			if(provinceobj.value==-1){
                return;
			}
		    for(var i=0;i<citys[provinceobj.value].length;i++){
                cityobj.innerHTML+=`<option value="`+i+`">`+citys[provinceobj.value][i]+`</option>`;
			}
		}
		function changecity(){
			var cityobj=document.getElementById('cityid');
			var countyobj=document.getElementById('countyid');
			countyobj.innerHTML=`<option value="">请选择县区</option>`;
			if(city.value==-1){
                return;
			}
			for(var i=0;i<county[cityobj.value].length;i++){
                countyobj.innerHTML+=`<option value="`+i+`">`+county[cityobj.value][i]+`</option>`;
			}
		}
		function changecounty(){
			var provinceobj=document.getElementById('provinceid');
			var cityobj=document.getElementById('cityid');
			var countyobj=document.getElementById('countyid');
			var provinceName=provinces[provinceobj.value];
			var cityName=citys[cityobj.value];
			var countyName=countys[countyobj.value];
			var selectobj=document.getElementById('select');
			selectobj.innerText=provinceName+":"+cityName+":"+countyName;
		}
		onload=function(){
			var provinceobj=document.getElementById('provinceid');
			for(var i=0;i<provinces.length;i++){
				provinceobj.innerHTML+=`<option value="`+i+`">`+provinces[i]+`</option>`;
			}
		}
	</script>
</html